<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>角色添加</title>
		<!-- 导入jquery核心类库 -->
		<script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
		<!-- 导入easyui类库 -->
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/ext/portal.css">
		<link rel="stylesheet" type="text/css" href="../../css/default.css">
		<script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.portal.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.cookie.js"></script>
		<script src="../../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
		<!-- 导入ztree类库 -->
		<link rel="stylesheet" href="../../js/ztree/zTreeStyle.css" type="text/css" />
		<script src="../../js/ztree/jquery.ztree.all-3.5.js" type="text/javascript"></script>
		<script type="text/javascript">
			$(function(){
				// 授权树初始化
				var setting = {
					data : {
						key : {
							title : "t"
						},
						simpleData : {
							enable : true
						}
					},
					check : {
						enable : true,
					}
				};
				
				$.ajax({
					url : '../../menu/menuList2.action',
					type : 'POST',
					dataType : 'text',
					success : function(data) {
						var zNodes = eval("(" + data + ")");
						$.fn.zTree.init($("#menuTree"), setting, zNodes);
					},
					error : function(msg) {
						alert('树加载异常!');
					}
				});

				// 点击保存
				$('#save').click(function(){
					// 获取ztree勾选节点集合 
					var treeObj = $.fn.zTree.getZTreeObj("menuTree");
					var nodes = treeObj.getCheckedNodes(true);
					// 获取所有节点id
					var array = new Array();
					for(var i=0 ; i< nodes.length ; i++){
					    //不保存父菜单id,为了回下ztree菜单
					    if(nodes[i].getParentNode() != null){
							array.push(nodes[i].id);
                        }
					}
					var menuIds = array.join(",");
					$("input[name='menuIds']").val(menuIds);
					// 提交form
					if($("#roleForm").form('validate')){
					    //异步提交表单:
                        $("#roleForm").form('submit',{
							success:function (data) {
                                data = eval("("+data+")")
                                if(data.success){
                                    //保存成返回查询页面:
                                    window.location.href="role.html";
                                }else{
                                    $.messager.alert("警告",data.message,"warning");
                                }
                            }
						});
					}
				});
				
				// 页面加载后， 获取所有权限数据，生成checkbox列表
				$.get("../../permission/permission_list.action", function(data){
					// 生成checkbox列表 
					$(data).each(function(){
						var checkbox = $("<input type='checkbox' name='permissionIds' />");
						checkbox.val(this.id);
						$("#permissionTD").append(checkbox);
						$("#permissionTD").append(this.name);
					});
				});

                //页面加载完毕处理两个html之间请求路径的参数,之后请求后台进行数据回显
                var parameter = window.location.search;
                if(parameter != null && parameter != '') {
                    $.get("../../role/selectRoleById.action" + parameter, function (data) {
                        //手动给表单回显赋值:
                        if(data[0] != undefined){
                            $("input[name='id']").val(data[0].ID);
                            $("input[name='name']").val(data[0].NAME);
                            $("input[name='keyword']").val(data[0].KEYWORD);
                            $("textarea[name='description']").val(data[0].DESCRIPTION);
                        }

                        //回显权限的数据:
                        var permissionIds = new Array();
                        //遍历获取权限,并回显
                        $(data).each(function () {
                            //将权限的id放入数组中
                            permissionIds.push(this.PERMISSIONID);
                        });
                        permissionIds.join(",")
                        $.unique(permissionIds);//去重数组
                        var checkbox = $("input:checkbox[name='permissionIds']");
                        $(checkbox).each(function () {
                            for(var i = 0; i < permissionIds.length; i++){
                                if($(this).val() == permissionIds[i]){
                                    $(this).attr("checked",true);
                                }
                            }
                        });
                        //回显菜单的下拉数据
                        var ztree = $.fn.zTree.getZTreeObj("menuTree");
                        $(data).each(function () {
                            //将权限的id放入数组中
							if(this.MENUID != undefined){
								var node = ztree.getNodeByParam("id",this.MENUID);
								var parent = node.getParentNode();
								ztree.expandNode(parent, true, false);//指定选中ID节点展开
								ztree.checkNode(node,true,true);//指定选中ID的节点
                            }
                        });

                    });
                }
			});

            // 将form请求数据转换为json对象
            $.fn.serializeJson = function(){
                var serializeObj={};
                var array=this.serializeArray();
                var str=this.serialize();
                $(array).each(function(){
                    if(serializeObj[this.name]){
                        if($.isArray(serializeObj[this.name])){
                            serializeObj[this.name].push(this.value);
                        }else{
                            serializeObj[this.name]=[serializeObj[this.name],this.value];
                        }
                    }else{
                        serializeObj[this.name]=this.value;
                    }
                });
                return serializeObj;
            };
		</script>
	</head>

	<body class="easyui-layout">
		<div region="north" style="height:31px;overflow:hidden;" split="false" border="false">
			<div class="datagrid-toolbar">
				<a id="save" icon="icon-save" href="#" class="easyui-linkbutton" plain="true">保存</a>
				<a icon="icon-back" class="easyui-linkbutton" plain="true" href="javascript:history.go(-1);">返回上一页</a>
			</div>
		</div>
		<div region="center" style="overflow:auto;padding:5px;" border="false">
			<form id="roleForm" method="post" action="../../role/saveAndUpdate.action">
				<input type="hidden" name="id">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">角色信息</td>
					</tr>
					<tr>
						<td>名称</td>
						<td>
							<input type="text" name="name" class="easyui-validatebox" data-options="required:true" />
						</td>
					</tr>
					<tr>
						<td>关键字</td>
						<td>
							<input type="text" name="keyword" class="easyui-validatebox" data-options="required:true" />
						</td>
					</tr>
					<tr>
						<td>描述</td>
						<td>
							<textarea name="description" rows="4" cols="60"></textarea>
						</td>
					</tr>
					<tr>
						<td>权限选择</td>
						<td id="permissionTD">
						</td>
					</tr>
					<tr>
						<td>菜单授权</td>
						<td>
							<input type="hidden" name="menuIds"/>
							<ul id="menuTree" class="ztree"></ul>
						</td>
					</tr>
				</table>
			</form>
		</div>
	</body>

</html>